<%@page contentType="text/html; charset=UTF-8"%>
<%@taglib uri="/WEB-INF/struts-tiles.tld" prefix="tiles"%>
<%@ taglib uri="/WEB-INF/struts-html.tld" prefix="html"%>
<%@include file="/common/definition.jsp"%>
<%@ page language="java" import="java.util.*"%>
<html:html>
<tiles:insert beanName="homepage-definition" flush="true">
	<tiles:put name="title"> Welcome </tiles:put>
	<tiles:put name="body" type="string">

		<div class="col-md-9">
			<!-- Nav tabs -->
			<ul class="nav nav-tabs" id="myTab">
				<li class="active"><a href="#hotSP" data-toggle="tab">Sản
						phẩm mới nhất</a></li>
				<li><a href="#newSP" data-toggle="tab">Sản phẩm ưa chuộm
						nhất</a></li>
				<li><a href="#discountSP" data-toggle="tab">Sảm phẩm giảm
						giá nhiều nhất</a></li>
			</ul>
			<!-- Tab panes -->
			<div class="tab-content">
				<div class="tab-pane fade in active" id="hotSP">
					<!-- START Vùng hiển thị sản phẩm -->
					<% 
					Integer i = 1;
					String row = null;
					String endRow = null;
					%>
					<div class="row">
						<s:iterator value="productModel.list12NewProduct">
							<!-- Path 1 sp -->
							<% if(i==1){
								row = "<div class='row'>";
							} else{
								row = "";
							}
							if(i == 3){
								endRow = "</div>";
							}else {endRow = "";}
							%>
							<%= row %>
									<% 
									i ++ ;
									if(i == 4) {
										i = 1;
									}
									%>
							<div class="col-sm-6 col-md-3">
								<a href="#" class="thumbnail"> <img class="img-thumbnail" 
									src='<s:property value="linkImg"/>'>
									<div class="caption">
										<h4 class="text-center">
											<s:property value="catName" />&nbsp;
											<s:property value="brandName" />&nbsp;
											<s:property value="productName" />
										</h4>
										<p>Description sp 1 tab 1</p>
									</div> </a>
							</div>
							
							<%= endRow %>
						</s:iterator>
						<!-- END 1 SP -->
						<!-- cứ thêm sp bằng code trên thoải mái . nó tự động nhảy xuống dòng -->
					</div>
					<!-- END vùng hiển thị sp -->
					<div class="col-md-12 text-right">
						<a href="#">More</a>
					</div>
				</div>
				<!-- div end tab 1 -->
				<div class="tab-pane fade" id="newSP">
					<div class="row">
						<!-- Path 1 sp -->
						<div class="col-sm-6 col-md-4">
							<a href="#" class="thumbnail"> <img src="img/default.png">
								<div class="caption">
									<h4 class="text-center">Sản phẩm mặc định tab 2</h4>
									<p>Description sp 1 tab 2</p>
								</div> </a>
						</div>
						<!-- END 1 SP -->
					</div>
					<div class="col-md-12 text-right">
						<a href="#">More</a>
					</div>
				</div>
				<div class="tab-pane fade" id="discountSP">
					<div class="row">
						<!-- Path 1 sp -->
						<div class="col-sm-6 col-md-3">
							<a href="#" class="thumbnail"> <img src="img/default.png">
								<div class="caption">
									<h4 class="text-center">Sản phẩm mặc định 3</h4>
									<p>Description sp 1 tab 3</p>
								</div> </a>
						</div>
						<!-- END 1 SP -->
					</div>
					<div class="col-md-12 text-right">
						<a href="#">More</a>
					</div>
				</div>
			</div>
		</div>
		<%-- 		<s:form> --%>
		<!-- 			<br /> -->
		<!-- 			<div class="center_content"> -->
		<!-- 				<table> -->
		<%-- 					<s:iterator value="listallproduct" status="listinfoStatus" --%>
		<!-- 						id="list"> -->
		<!-- 						<tr> -->
		<%-- 							<s:if test="#listinfoStatus.even == true"> --%>
		<%-- 								<td><s:property value="productName" /> --%>
		<!-- 								</td> -->
		<%-- 							</s:if> --%>
		<%-- 							<s:else> --%>
		<%-- 								<td><s:property value="productName" /> --%>
		<!-- 								</td> -->
		<%-- 							</s:else> --%>
		<!-- 						</tr> -->
		<%-- 					</s:iterator> --%>
		<!-- 				</table> -->
		<!-- 			</div> -->
		<%-- 		</s:form> --%>
	</tiles:put>
</tiles:insert>
</html:html>
